<template>
    <div id="app" v-loading="loading" :element-loading-text="loadingText" element-loading-background="rgba(0, 0, 0, 0.5)">
        <router-view/>
    </div>
</template>

<script>
    import store from '@/store'

    export default {
        name: 'App',
        created () {
            //   在页面加载时读取sessionStorage里的状态信息
            if (localStorage.getItem('tagsViewQC')) {
                this.$store.dispatch('tagsView/setSession', JSON.parse(localStorage.getItem('tagsViewQC')))
            }

            //   页面刷新时将state数据存储到sessionStorage中
            window.addEventListener('pagehide', () => {
                localStorage.setItem('tagsViewQC', JSON.stringify(this.$store.state.tagsView))
            })

            //   在页面加载时读取sessionStorage里的状态信息
            if (localStorage.getItem('searchFormQC')) {
                this.$store.dispatch('search/setSearchForm', JSON.parse(localStorage.getItem('searchFormQC')))
            }

            //   页面刷新时将state数据存储到sessionStorage中
            window.addEventListener('pagehide', () => {
                localStorage.setItem('searchFormQC', JSON.stringify(this.$store.state.search.searchForm))
            })

            let _this = this
            window.onbeforeunload = function () {
                // 判断页面是刷新还是关闭，刷新只清除当前页面数据，关闭清除所有
                if (event.clientX > document.body.clientWidth && (event.clientY < 0 || event.altKey)) {
                    sessionStorage.clear()
                } else {
                    sessionStorage.removeItem(_this.$route.name)
                    if (this.$route && this.$route.query.tags) {
                        let newQuery = JSON.parse(JSON.stringify(this.$route.query))
                        delete newQuery.tags
                        this.$router.replace({ query: newQuery })
                    }
                }
            }
        },
        computed: {
            loading () {
                return store.getters.loading
            },
            loadingText () {
                return store.getters.loadingText
            }
        }
    }
</script>
<style>
    .el-loading-mask {
        position: fixed;
        z-index: 9999;
    }
</style>
